<template>
	<el-dialog title="新增/修改" :visible.sync="visible" width="500px" :center="false" >
		<div slot="title" class="dialog-header-title">
			<i class="el-icon-lock" style="color: #FFF"></i>&nbsp;
			<span style="color: #FFF">{{type=='add'?'新增':'修改'}}</span>
		</div>

		<div class="smp-search">
			<el-form :inline="false" label-width="100px" size="mini" ref="form" :model="form" :rules="rules">
				<el-row>
				<!-- 	<el-col :span="24">
						<el-form-item label="文件名:" prop="fileName">
							<el-input v-model="form.fileName" placeholder="请输入文件名"></el-input>
						</el-form-item>
					</el-col> -->
				
					
					
					<el-col :span="24">
						<el-form-item label="文件:" prop="aa"  style="text-align: left;">
						<el-upload  :on-change="changeFile" :multiple="false" :limit="1" :auto-upload="false" :file-list="fileList" action="#">
							<el-button size="mini"  style="width: 100%;" type="primary"><i class="el-icon-upload"/>添加附件</el-button>
						</el-upload>
						</el-form-item>
					</el-col>
					
					<el-col :span="24">
						<el-form-item label="文件描述:" prop="fileDescribe">
							<el-input type="textarea" v-model="form.fileDescribe" placeholder="请输入文件描述"></el-input>
						</el-form-item>
					</el-col>
					
			
				</el-row>
			</el-form>
		</div>
		<span slot="footer" class="dialog-footer">
			<el-button type="primary" plain @click="submit" size="mini">
					<i class="el-icon-check"></i>
					确定</el-button>
				<el-button @click="visible = false" size="mini">
					<i class="el-icon-close"></i>
					取消</el-button>
		</span>
	</el-dialog>
</template>
<script>
	"use strict";
import {addFile,updateFile} from '@/api/help.js';
	export default {
		data() {
			return {
				visible: false,
				fileList:[],
				fileOldName:'',
				type:'add',
				form: {
					fileName: "",
					fileDescribe: "",
				},
				rules: {
					fileDescribe: [{
						required: true,
						message: '请输入文件描述',
						trigger: 'blur'
					}]
				}
			}

		},
		methods: {
			
			changeFile(file,fileList){
				console.info(fileList);
				this.fileList = fileList;
			},
			
			ShowDialog() {
				this.type='add';
				this.form={};
				this.visible = true;
			},
			
			showDialog1(row) {
				Object.assign(this.form,row);
				this.type='update';
				this.fileOldName=row.fileName;
				this.visible = true;
			},
			
			
			handleCancel(e) {
				this.visible = false;
			},
			submit() {//新增
			this.$refs["form"].validate((valid)=>{
				if(valid){
					
					var data = new FormData();
					data.append("file",this.fileList[0].raw);
					data.append("fileName",this.form.fileName);
					data.append("fileDescribe",this.form.fileDescribe);
					
					if(this.type=='add'){
						addFile(data).then(response => {
							if(response.data.code == "0000"){
								this.$message.success(response.data.message);
							}else{
								this.$message.error(response.data.message);
							}
						}).catch(error => {
							this.$message.error(error.message);
						});
					}else{
						if(this.fileOldName != this.fileList[0].name){
							this.$message({
						duration:5000,
								type: 'error',
								message: '修改前后文件名不一致！'
							});
							return false;
						}else{
							updateFile(data).then(response => {
								if(response.data.code == "0000"){
									this.$message.success(response.data.message);
								}else{
									this.$message.error(response.data.message);
								}
							}).catch(error => {
								this.$message.error(error.message);
							});
						}
					}
					
					this.visible = false;
					this.$emit("fresh")
				}
			});
			
		
				
			},
		}
	};
</script>
